/*------------------------自定义样式 PC播放器样式-------------------------*/
#video-container {
  .video-js{
    position: relative;
    .vjs-control-bar{
      width: 100%;
      justify-content: center;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 199px;
      background: url('/static/pc/images/video/control_mask.png') no-repeat;
      background-size: cover;
      .vjs-control{
        margin-top: 139px;
        height: 60px;
      }
      .vjs-control:before{
        line-height: 60px;
      }
      .vjs-play-control{
        left: 0;
        &:before{
          position: absolute;
          content: '' !important;
          display: block;
          width: 18px;
          height: 22px;
          background: url(/static/pc/images/video/img.png) no-repeat center;
          background-size: cover;
          background-position: -26px 0;
          top: 50%;
          left: 50%;
          margin-left: -9px;
          margin-top: -11px;
        }
        &.vjs-playing:before{
          background: url(/static/pc/images/video/img.png) no-repeat center;
          background-size: cover;
          background-position: 0 0;
        }
      }
      .vjs-time-control{
        min-width: 0;
        padding: 0 5px;
        line-height: 60px;
      }
      .vjs-current-time{
        display: block;
      }
      .vjs-time-divider{
        display: block; 
        margin-top: 139px;
        height: 60px;
      }
      .vjs-duration{
        display: block;
      }
      .vjs-progress-control{
        // left: -20px;
      }
      .vjs-volume-menu-button{
        width: 30px;
        // left: 700px;
        &:before{
          position: absolute;
          top: 50%;
          height: 20px;
          margin-top: -10px;
          line-height: 20px;
        }
      }
    }
    .vjs-big-play-button{
      width: 60px;
      height: 60px;
      border-radius: 50%;
      margin-left: -30px;
      margin-top: -30px;
      &:before{
        position: absolute;
        content: '' !important;
        display: block;
        width: 18px;
        height: 22px;
        background: url(/static/pc/images/video/img.png) no-repeat center;
        background-size: cover;
        background-position: -26px 0;
        top: 50%;
        left: 50%;
        margin-left: -7px;
        margin-top: -11px;
      }
    }
  } 
}
// #video-container .video-js .vjs-current-time,
// #video-container .vjs-duration {
//   width: 3em;
// }
// #video-container .vjs-current-time .vjs-current-time-display,
// #video-container .vjs-time-divider > div,
// #video-container .vjs-duration .vjs-duration-display,{
//   position: absolute;
//   top: 50%;
//   height: 3em;
//   margin-top: -1.5em;
// }
// #video-container .vjs-volume-menu-button{
//   width: 3em;
// }
// #video-container .vjs-volume-menu-button:before{
//   position: absolute;
//   top: 50%;
//   height: 2em;
//   margin-top: -1em;
//   line-height: 2em;
// }
#video-container .video-js .vjs-remaining-time{display: none;}
// #video-container .video-js .vjs-control:before{
//   line-height: 4em;
//   font-size: 2.5em
// }
// #video-container .vjs-big-play-centered .vjs-big-play-button{
//   width: 2em;
//   height: 2em;
//   border-radius: 50%;
//   margin-left: -1em;
//   margin-top: -1em;
// }
// #video-container .video-js .vjs-big-play-button:before{
//   position: absolute;
//   content: '' !important;
//   display: block;
//   width: 0.6em;
//   height: 0.74em;
//   background: url(/static/pc/images/video/img.png) no-repeat center;
//   background-size: cover;
//   background-position: -26px 0;
//   top: 50%;
//   left: 50%;
//   margin-left: -0.25em;
//   margin-top: -0.37em;
// }
// #video-container .vjs-icon-play:before, #video-container .video-js .vjs-play-control:before{
//   position: absolute;
//   content: '' !important;
//   display: block;
//   width: 1em;
//   height: 1.2em;
//   background: url(/static/pc/images/video/img.png) no-repeat center;
//   background-size: cover;
//   background-position: -26px 0;
//   top: 50%;
//   left: 50%;
//   margin-left: -0.3em;
//   margin-top: -0.6em;

// }
// #video-container .vjs-icon-pause:before, #video-container .video-js .vjs-play-control.vjs-playing:before{
//   background: url(/static/pc/images/video/img.png) no-repeat center;
//   background-size: cover;
//   background-position: 0 0;
// }
// #video-container .vjs-fullscreen-control{
//   width: 3em;
// }
#video-container .vjs-icon-fullscreen-enter:before, #video-container .video-js .vjs-fullscreen-control:before{
  position: absolute;
  content: '' !important;
  display: block;
  width: 20px;
  height: 20px;
  background: url(/static/pc/images/video/img.png) no-repeat center;
  background-size: cover;
  background-position: -96px 0;
  top: 50%;
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
}
#video-container .vjs-icon-fullscreen-exit:before, #video-container .video-js.vjs-fullscreen .vjs-fullscreen-control:before{
  background: url(/static/pc/images/video/img.png) no-repeat center;
  background-size: cover;
  background-position: -116px 0;
}
#video-container .video-js .vjs-slider{
  background-color: rgba(255, 255, 255, 0.4)
}
#video-container .vjs-menu-button-popup .vjs-menu .vjs-menu-content{
  background-color: transparent;
}
#video-container .vjs-menu-button-popup.vjs-volume-menu-button-vertical .vjs-menu {
  left: 0;
  // top: -5em;
  height: 8em;
  width: 2.9em;
}
.video-js .vjs-progress-control{
  max-width: 600px;
}